<template>
	<view class="pop-privacy-block" v-if="showPrivacy">
		<view class="popup-box">
			<view class="weui-half-screen-dialog__hd">{{title}}</view>
			<view class="weui-half-screen-dialog__bd">
				<text class="weui-half-screen-dialog__tips">{{desc_front}}</text>
				<text class="weui-half-screen-dialog__tips color-url" @click="openPrivacyContract">{{urlTitle}}</text>
				<text class="weui-half-screen-dialog__tips">{{desc_back}}</text>
			</view>
			<view class="weui-half-screen-dialog__ft">
				<button class="weui-btn" @click="handleDisagree">拒绝</button>
				<button type="default" open-type="agreePrivacyAuthorization" class="weui-btn agree"
					@agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			showPrivacy: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				title: "用户隐私保护提示",
				desc_front: "感谢您使用本产品，您使用本产品前应当仔细阅读并同意",
				urlTitle: "《小程序隐私保护指引》",
				desc_back: "当您点击同意并开始使用产品服务时，即表示你已理解并同意该条款内容，该条款将对您产生法律约束力。如您拒绝，将无法更好的体验产品。",
			};
		},
		methods: {
			
			//跳转隐私协议详情
			openPrivacyContract() {
				uni.openPrivacyContract({});
			},
			
			//同意
			handleAgreePrivacyAuthorization() {
				this.$emit('confirm')
			},
			
			//拒绝
			handleDisagree() {
				this.$emit('disagree')
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pop-privacy-block{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		height: 100%;
		z-index: 11111;
		background-color: rgba(0,0,0,.6);
	}
	.popup-box {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 80vw;
		// height: 40vh;
		overflow: hidden;
		background: #ffffff;
		padding: 50rpx 30rpx;
		border-radius: 24rpx;
		transform: translate(-50%,-50%);

		.weui-half-screen-dialog__hd {
			font-size: 36rpx;
			font-family: Source Han Sans CN-Bold, Source Han Sans CN;
			font-weight: bold;
			color: #222;
			line-height: 56rpx;
			text-align: center;
		}

		.weui-half-screen-dialog__bd {
			margin-top: 28rpx;
			text-indent: 2em;
			.weui-half-screen-dialog__tips {
				font-size: 28rpx;
				font-family: Source Han Sans CN-Normal, Source Han Sans CN;
				font-weight: 400;
				color: #333;
				line-height: 32rpx;
			}
		}

		.weui-half-screen-dialog__ft {
			display: flex;
			justify-content: space-evenly;
			align-items: center;
			margin-top: 48rpx;
			.weui-btn {
				padding: 0 80rpx;
				margin: 0;
				background: none;
				font-size: 32rpx;
				font-family: Source Han Sans CN-Normal, Source Han Sans CN;
				font-weight: 400;
				color: #666;
				line-height: 80rpx;
				background-color: #f4f4f4;
				border-radius: 10rpx;
			}

			.agree {
				color: $uni-text-color-inverse;
				background: $uni-bg-color-primary;
			}
		}

		.color-url {
			color: #2dbb55 !important;
		}
	}
</style>